<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <script src="/js/jquery-3.6.1.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>

    <style>
      b{
        font-weight: bolder;
        color: red;
      }
    </style>
    <link rel="stylesheet" href="/Plugins/bootstraptable/bootstrap-table.min.css">
    <link href="https://fonts.googleapis.com/css?family=Lato:300,400&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="/css/style.css">
</head>
<body>
<!--<div class="container-fluid">-->
<!--  <div class="panel panel-default">-->
<!--    <div class="panel-heading">Panel heading without title</div>-->
<!--    <div class="panel-body">-->

<!--      <form>-->
<!--        <div class="form-group">-->
<!--          <label for="username">用户名:</label>-->
<!--          <input type="text" class="form-control" id="username" name="username" placeholder="用户名">-->
<!--        </div>-->
<!--        <div class="form-group">-->
<!--          <label for="password">密码:</label>-->
<!--          <input type="text" class="form-control" id="password" name="password" placeholder="密码">-->
<!--        </div>-->

<!--        <button type="button" class="btn btn-default" onclick="login();">登录</button>-->
<!--      </form>-->

<!--    </div>-->
<!--  </div>-->
<!--</div>-->

<div class="login-div">
    <div class="logo"></div>
    <div class="title">Purple Cloud</div>
    <div class="sub-title">Tom</div>
    <div class="fields">
        <div class="username">
            <svg t="1663995993001" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3127" ><path d="M861.658611 876.885408 164.03803 876.885408c-56.431244 0-102.340853-45.911656-102.340853-102.345969l0-518.621814c0-56.43329 45.910633-102.345969 102.340853-102.345969L861.658611 153.571654c31.7931 0 53.361325 9.448186 64.100924 28.083615 11.435447 19.834744 7.302313 42.0937-11.340279 61.066821l-11.351536 11.55722 0.001023 0.001023c-0.045025 0.045025-0.601704 0.61296-1.64957 1.679245-0.103354 0.106424-0.205685 0.209778-0.305969 0.312108l-30.90487 31.462572c-0.024559 0.024559-0.050142 0.050142-0.073678 0.074701-27.242458 27.733645-70.074985 71.338768-123.530454 125.759215L619.241466 543.229259c-26.452465 26.931373-52.902884 53.858652-79.356372 80.785931l-6.842849 6.969739c-3.352351 3.415796-7.936763 5.339612-12.721743 5.339612-0.008186 0-0.016373 0-0.023536 0-4.79419-0.007163-9.381671-1.943258-12.729929-5.373381l-354.881566-363.519294c-6.876618-7.04444-6.740518-18.329461 0.302899-25.206078 7.04444-6.877641 18.329461-6.741541 25.206078 0.302899l342.16494 350.493629c24.486694-24.925692 48.969295-49.848315 73.448826-74.772984l295.180859-300.509215c10.350742-10.534937 7.335059-15.766079 5.885034-18.279319-3.749394-6.507204-15.85613-10.238179-33.215496-10.238179L164.03803 189.222619c-36.774555 0-66.691935 29.919427-66.691935 66.696028l0 518.621814c0 36.775578 29.91738 66.696028 66.691935 66.696028L861.658611 841.23649c36.775578 0 66.696028-29.919427 66.696028-66.696028L928.35464 324.875159c-0.01535-3.1569 0.242524-47.771003 25.434276-88.073918 5.216815-8.347109 16.21531-10.885931 24.562419-5.66707 8.347109 5.217838 10.884908 16.214287 5.66707 24.562419-19.908422 31.851429-20.016893 68.64645-20.015869 69.013817 0.001023 0.055259 0.001023 0.058328 0.001023 0.113587l0 449.715445C964.004581 830.973752 918.092925 876.885408 861.658611 876.885408z" p-id="3128"></path></svg>
            <input type="username" class="user-input" id="username" placeholder="Username">
        </div>
        <div class="password">
            <svg t="1663996116591" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4843" ><path d="M704 416v-96a192 192 0 1 0-384 0v96h384zM192 480v383.776A31.968 31.968 0 0 0 223.744 896h576.512c17.184 0 31.744-14.4 31.744-32.224V480.224 480H192z m-64-16V448a32 32 0 0 1 32-32h96v-96a256 256 0 1 1 512 0v96h96c17.664 0 32 14.208 32 32v448.192A64 64 0 0 1 831.84 960H192.16A64 64 0 0 1 128 896.192V464zM544 640v128.32c0 17.472-14.208 31.68-32 31.68a32 32 0 0 1-32-31.68V640h-32.32a31.776 31.776 0 0 1-31.68-32 32 32 0 0 1 31.68-32h128.64c17.472 0 31.68 14.208 31.68 32a32 32 0 0 1-31.68 32H544z" fill="#333333" p-id="4844"></path></svg>
            <input type="password" class="pass-input" id="password" placeholder="Password">
        </div>
    </div>
    <button class="login-button" type="submit"onclick="login();">LOG IN</button>
    <div class="link"><a href="#">Forgot password?</a></div>

</div>

<script type="text/javascript">

    function login(){
        let name = $("#username").val();
        let password = $("#password").val();

        $.ajax({
            url:"/api/login/user",
            data:{
                username:name,
                password:password
            }
        }).done(function (rs){
            if(rs >= 0){
                //成功
                window.location.href="/student/list"
            }else {
                alert("出错了，您输入的用户名和密码不正确!")
            }
        });
    }
</script>
</body>
</html>